{% extends 'sales/base.html' %}
{% load static %}
{% load paginate %}
{% load common_tags %}
{% load thumbnail %}
{% block extralinks %}
<style>
  .table_container_row .card .card-body table tbody .due-date td {
    color: red;
  }
  .form-group label{
    font-weight: 800;
  }
</style>
{% endblock %}
{% block content %}

<div class="main_container">
  
  <div class="row marl">
    <div class="col-lg-12 text-right">
      <span class="d-inline"><a class="primary_btn" href="{% url 'tasks:task_create' %}"><i class="fa fa-plus"></i> Add
          New Task</a></span>
    </div>
  </div>
  <div class="filter_row list_filter_row row marl">
    <div class="col-md-12">
      <div class="card">
        <div class="card-body">
          <form id="docs_filter" method="POST" action="">
            <div class="card-body">
              <div class="card-title">Filters</div>
              <div class="row marl">
                <div class="filter_col col-md-4">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Title</label>
                    <input type="text" class="form-control" placeholder="Task Title" name="task_title"
                      {% if request.POST.task_title %} value="{{request.POST.task_title}}" {%endif%} />
                  </div>
                </div>
                <div class="filter_col col-md-2">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Status</label>
                    <select class="form-control" id="id_status" name="status">
                      <option value="">--Status--</option>
                      {% for each_status in status_choices %}
                      <option value="{{each_status.0}}" {% if request.POST.status %}
                        {% ifequal each_status.0 request.POST.status %}selected{% endifequal %}{% endif %}>
                        {{each_status.1}} </option>
                      {% endfor%}
                    </select>
                  </div>
                </div>
                <div class="filter_col col-md-3">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Priority</label>
                    <select class="form-control" id="id_priority" name="priority">
                      <option value="">--Priority-- </option>
                      {% for each_priority in priority_choices %}
                      <option value="{{each_priority.0}}" {% if request.POST.priority %}
                        {% ifequal each_priority.0 request.POST.priority %}selected{% endifequal %}{% endif %}>
                        {{each_priority.1}} </option>
                      {% endfor%}
                    </select>
                  </div>
                </div>
                <div class="filter_col col-3">
                  <div class="form-group buttons_row">
                    <button class="btn btn-primary save" type="submit">Search</button>
                    <a href="{% url 'tasks:tasks_list' %}" class="btn btn-default clear">Clear</a>
                  </div>
                </div>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
  
  <div class="table_container_row row marl ">
    <div class="col-md-12">
      <div class="card">
        <div class="card-body">
          <div class="panel-heading-list card-title text-right">
            <span class="total_count float-left">Tasks - {% if show_pageitems %} {% show_pageitems %}{% else %}
              {{tasks|length}}{% endif %}</span>
            <span class="filter_toggle ">
              <a href="#" class="primary_btn"><i class="fas fa-filter"></i></a>
            </span>
          </div>
          <div class="table-responsive">
            <table class="table ">
              <thead>
                {% if tasks|length > 0 %}
                <tr>
                  <th width="5%">S.No</th>
                  <th width="15%">Title</th>
                  <th width="10%">Created By</th>
                  <th width="15%">Status</th>
                  <th width="10%">Priority</th>
                  <th width="10%">Due Date</th>
                  <th width="10%">Assigned To</th>
                  <th width="10%">Created On</th>
                  <th width="10%">Actions</th>
                </tr>
                {% endif %}
              </thead>
              <tbody>
                {% if per_page %}
                {% paginate per_page tasks %}
                {% else%}
                {% paginate 10 tasks %}
                {% endif %}
                {% for task in tasks %}


                {% if task.due_date %}

                {% if task.due_date < today and task.status != 'completed' %}
                <tr id="task_{{task.id}}" class="text-center due-date">
                  <td scope="row">{{ forloop.counter }}</td>
                  <td>{% if task.title %}<a href="#" data-toggle="modal" data-target="#exampleModalCenter_task{{task.id}}"
                      style="color:red;">{{ task.title }}</a>{% endif %}
                  </td>
                  <td>
                    {% if task.created_by %}
                    {% if task.created_by.profile_pic %}
                    {% thumbnail task.created_by.profile_pic "40x40" crop="center" as im %}
                    <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}"
                      title="{{ task.created_by }}" style="border-radius: 50%" />
                    {% endthumbnail %}
                    {% else %}
                    <img src="{% static 'images/user.png' %}" alt="Micro profile pic"
                      style="width: 40px;height: 40px;border-radius: 50%;" title="{{ task.created_by }}" />
                    {% endif %}
                    {% else %}
                    None
                    {% endif %}
                  </td>
                  
                  <td>{{task.status}}</td>
                  <td>{{task.priority}}</td>

                  {% if task.due_date %}
                  <td>{{task.due_date}}</td>
                  {% else %}
                  <td>-</td>
                  {% endif %}


                  <td>{% with task_users=task.get_team_and_assigned_users %}
                    {% for user in task_users %}
                    {% if user.profile_pic %}
                    {% thumbnail user.profile_pic "40x40" crop="center" as im %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" title="{{ user.email }}">
                    </a>
                    {% endthumbnail %}
                    {% else %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{% static 'images/user.png' %}" title="{{ user.email }}" width="40" height="40">
                    </a>
                    {% endif %}
                    {% empty %}
                    None
                    {% endfor %}
                    {% endwith %}
                  </td>
                  <td title="{{task.created_on}}">{{task.created_on_arrow}}</td>
                  <td class="actions">
                    {% if request.user|view_edit_condition:task %}                    
                      <a href="{% url 'tasks:task_detail' task.id %}" class="btn btn-info edit" title="View" ><i
                        class="fas fa-eye"></i></a>
                      <a href="{% url 'tasks:task_edit' task.id %}" class="btn btn-success edit" title="Edit" ><i
                        class="fas fa-pencil-alt"></i></a>
                    {% endif %}
                    {% if request.user|delete_condition:task %}                    
                        <a href="{% url 'tasks:task_delete' task.id %}" class="btn btn-danger delete remove_document" title="Delete" ><i
                        class="fas fa-trash-alt"></i></a>
                    {% endif %}
                  </td>
                </tr>
                
                {% else %}
                <tr id="task_{{task.id}}" class="text-center">
                  <td scope="row">{{ forloop.counter }}</td>
                  <td>{% if task.title %}<a data-toggle="modal" data-target="#exampleModalCenter_task{{task.id}}">{{ task.title }}</a>{% endif %}
                  </td>
                  <td>
                    {% if task.created_by %}
                    {% if task.created_by.profile_pic %}
                    {% thumbnail task.created_by.profile_pic "40x40" crop="center" as im %}
                    <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}"
                      title="{{ task.created_by }}" style="border-radius: 50%" />
                    {% endthumbnail %}
                    {% else %}
                    <img src="{% static 'images/user.png' %}" alt="Micro profile pic"
                      style="width: 40px;height: 40px;border-radius: 50%;" title="{{ task.created_by }}" />
                    {% endif %}
                    {% else %}
                    None
                    {% endif %}
                  </td>
                  
                  <td>{{task.status}}</td>
                  <td>{{task.priority}}</td>

                  {% if task.due_date %}
                  <td>{{task.due_date}}</td>
                  {% else %}
                  <td>-</td>
                  {% endif %}


                  <td>
                    {% with task_users=task.get_team_and_assigned_users %}
                    {% for user in task_users %}
                    {% if user.profile_pic %}
                    {% thumbnail user.profile_pic "40x40" crop="center" as im %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" title="{{ user.email }}">
                    </a>
                    {% endthumbnail %}
                    {% else %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{% static 'images/user.png' %}" title="{{ user.email }}" width="40" height="40">
                    </a>
                    {% endif %}
                    {% empty %}
                    None
                    {% endfor %}
                    {% endwith %}
                  </td>
                  <td title="{{task.created_on}}">{{task.created_on_arrow}}</td>
                  <td class="actions">
                    {% if request.user|view_edit_condition:task %}                    
                    <a href="{% url 'tasks:task_detail' task.id %}" class="btn btn-info edit" title="View"><i
                      class="fas fa-eye"></i></a>
                    <a href="{% url 'tasks:task_edit' task.id %}" class="btn btn-success edit" title="Edit" ><i
                        class="fas fa-pencil-alt"></i></a>
                    {% endif %}
                    {% if request.user|delete_condition:task %}                    
                    <a href="{% url 'tasks:task_delete' task.id %}" class="btn btn-danger delete remove_document" title="Delete" ><i
                        class="fas fa-trash-alt"></i></a>
                    {% endif %}
                  </td>
                </tr>
                {% endif %}
                {% else %}
                <tr id="task_{{task.id}}" class="text-center">
                  <td scope="row">{{ forloop.counter }}</td>
                  <td>{% if task.title %}<a href="#" data-toggle="modal" data-target="#exampleModalCenter_task{{task.id}}">{{ task.title }}</a>{% endif %}
                  </td>
                  <td>
                    {% if task.created_by %}
                    {% if task.created_by.profile_pic %}
                    {% thumbnail task.created_by.profile_pic "40x40" crop="center" as im %}
                    <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}"
                      title="{{ task.created_by }}" style="border-radius: 50%" />
                    {% endthumbnail %}
                    {% else %}
                    <img src="{% static 'images/user.png' %}" alt="Micro profile pic"
                      style="width: 40px;height: 40px;border-radius: 50%;" title="{{ task.created_by }}" />
                    {% endif %}
                    {% else %}
                    None
                    {% endif %}
                  </td>
                  
                  <td>{{task.status}}</td>
                  <td>{{task.priority}}</td>

                  {% if task.due_date %}
                  <td>{{task.due_date}}</td>
                  {% else %}
                  <td>-</td>
                  {% endif %}


                  <td>{% with task_users=task.get_team_and_assigned_users %}
                    {% for user in task_users %}
                    {% if user.profile_pic %}
                    {% thumbnail user.profile_pic "40x40" crop="center" as im %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" title="{{ user.email }}">
                    </a>
                    {% endthumbnail %}
                    {% else %}
                    <a href="{% url 'common:view_user' user.id %}">
                      <img src="{% static 'images/user.png' %}" title="{{ user.email }}" width="40" height="40">
                    </a>
                    {% endif %}
                    {% empty %}
                    None
                    {% endfor %}
                    {% endwith %}
                  </td>
                  <td title="{{task.created_on}}">{{task.created_on_arrow}}</td>
                  <td class="actions">
                    {% if request.user|view_edit_condition:task %}                    
                    <a href="{% url 'tasks:task_detail' task.id %}" class="btn btn-info edit" title="View"><i
                      class="fas fa-eye"></i></a>
                    <a href="{% url 'tasks:task_edit' task.id %}" class="btn btn-success edit" title="Edit"><i
                        class="fas fa-pencil-alt"></i></a>
                    {% endif %}
                    {% if request.user|delete_condition:task %}                    
                    <a href="{% url 'tasks:task_delete' task.id %}" class="btn btn-danger delete remove_document" title="Delete" ><i
                        class="fas fa-trash-alt"></i></a>
                    {% endif %}
                  </td>
                </tr>
                

                {% endif %}

                {% endfor %}
              </tbody>
            </table>
          </div>
          {% ifequal tasks|length 0 %}
          <h6 class="text-center">No Tasks Found</h6>
          {% endifequal %}
          <div class="text-center row marl">
            {% show_pages %}
          </div>
        </div>
      </div>
      <br clear="all">
    </div>
  </div>
  
  
</div>


{% for task in tasks %}

<div class="modal fade" id="exampleModalCenter_task{{task.id}}" tabindex="-1" role="dialog"
  aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">{{ task.title }}</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
        <div class="" id="">
          <div class="">
            <div class="col-md-12" id="opacity_block">
              <div class="card">
                <div class="card-body" id="datashow" style="margin: 0; padding: 0;">
                  <div class="card-title text-right">
                    <h5>
                      
                      <span style="margin-top: 0px">
                        
                      </span>
                    </h5>
                  </div>
                  <div class="row marl">
                    <div class="col-md-4">
                      {% if task.title %}
                      <div class="filter_col col-md-12" id="iname">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_name" data-name="name">title</label>
                          <div class="account_field" id="account_name" data-name="name">{{ task.title }}</div>
                        </div>
                      </div>
                      {% endif %}
                      {% if task.priority %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_phone" data-name="name">Priority</label>
                          <div class="account_field" id="account_phone" data-name="name">{{ task.priority }}</div>
                        </div>
                      </div>
                      {% endif %}
                      {% if task.status %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_status" data-name="name">Status</label>
                          <div class="account_field" id="account_status" data-name="name">{{ task.status }}</div>
                        </div>
                      </div>
                      {% endif %}
                    </div>
                    <div class="col-md-4">
                      {% if task.due_date %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_due_date" data-name="name">Due Date</label>
                          <div class="account_field" id="account_email" data-name="name">{{ task.due_date }}</div>
                        </div>
                      </div>
                      {% endif %}
                      {% if task.account %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_email" data-name="name">Account</label>
                          <div class="account_field" id="account_email" data-name="name">{{ task.account }}</div>
                        </div>
                      </div>
                      {% endif %}
                      {% if task.contacts.all %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_website" data-name="name">Contacts</label>
                          {% for contact in task.contacts.all %}
                          <div class="account_field" id="account_website" data-name="name">{{ contact }}</div>
                          {% endfor %}
                        </div>
                      </div>
                      {% endif %}
                    </div>
                    <div class="col-md-4">
                      {% if task.assigned_to.all %}
                      <div class="filter_col col-md-12">
                        <div class="form-group">
                          <label class="acc_field_label" for="id_website" data-name="name">Assigned To</label>
                          {% for user in task.get_team_and_assigned_users %}
                          <div class="account_field" id="account_website" data-name="name">
                            <a href="{% url 'common:view_user' user.id %}">
                              {{ user }}
                            </a>
                          </div>
                          {% endfor %}
                        </div>
                      </div>
                      {% endif %}
                    </div>
                    <div class="col-md-12">
                      <div class="created_information">
                        Created by <b>{{ task.created_by }}</b> on <b title="{{ task.created_on }}">{{ task.created_on_arrow }}</b>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    
  </div>
</div>


{% endfor %}



{% endblock %}
{% block js_block %}
<script type="text/javascript">
  $(document).ready(function () {
    $('.assigned_users').select2();
    $(".filter_toggle").click(function () {
      $(".list_filter_row").toggle();
    });
  });

  search = "{{search}}"

  if (search == 'True') {
    $(".list_filter_row").show();
  }

  $('.remove_document').click(function (e) {
    e.preventDefault()
    url = $(this).attr('href')
    if (!confirm('Are you sure you want to delete?'))
      return;
    window.location = $(this).attr('href')
  });

  $(".reset").click(function (e) {
    window.location = "{% url 'common:doc_list'%}"
  });

  $("a[rel='page']").click(function (e) {
    e.preventDefault();
    $('#docs_filter').attr("action", $(this).attr("href"));
    $('#docs_filter').submit();
  });
</script>
{% endblock js_block %}
